{include file='public/header' /}

<style>
    .work{
        width:300px;
        margin-top: 10px
    }
    .work1{
        width:100px;
        margin-top: 10px
    }

</style>
<style>
    .edui-dialog-image-body{
        height: 220px!important;
        overflow: hidden;
    }
    .edui-dialog-image .edui-image-wrapper{
        box-sizing: border-box;
        height: 100%;
    }
    .edui-tab-nav{
        height:43px;
    }
    .edui-dialog-image .edui-image-content {
        height: 200px!important;
    }
    #demo2{
        display: flex;
        align-items: center;
    }
    #demo2 li .operate{ color: #000; display: none;}
    #demo2 li .close{position: absolute;top: 5px; right: 5px;cursor:pointer;}
    #demo2 li:hover .operate{ display: block;}
    .operate{
        position: absolute;
        right: 0;
        top: -9px;
        color: black;
        font-size: 34px;
        /* border: 1px solid red; */
        font-weight: bold;
    }
    .item_img{
        position: relative;margin-right: 10px;
    }
    .attribute{
        width: 100%;
        border: 1px solid #e6e6e6;
        margin-top:20px;
    }
    .atr{
        height: 50px;
        border: 1px solid #e6e6e6;
    }
    .ath{
        width: 100px; border-left: 1px solid #e6e6e6; border-right: 1px solid #e6e6e6;
    }
    .atd{
        display: flex;
        text-align: center;
        height: 38px;
        justify-content: center;
        align-items: center;
    }
    table input{
        text-align: center;
        border: none!important;
    }
    table td{
        border-right: 1px solid #e6e6e6;
        border-bottom: 1px solid #e6e6e6;
    }
    table td:last-child{
        border-right: none;
    }
</style>
<div class="layui-card">

    <div class="layui-card-body">
        <form class="layui-form" action="{:__url('mall.account/edit',['id'=>$row.id])}" method="post">

            <div class="layui-form-item">
                <label for="" class="layui-form-label">分类</label>
                <div class="layui-input-inline">

                    <select name="category_id" disabled>
                        <option value="0"></option>
                        {foreach $data as $v}
                        <option value="{$v.id}" {if isset($row.category_id)&&$row.category_id==$v.id}selected{/if}>{$v.name}</option>
                        {if isset($v.childs) && !empty($v.childs)}
                        {foreach $v.childs as $vv}
                        <option value="{$vv.id}" {if isset($row.category_id)&&$row.category_id==$vv.id}selected{/if} >&nbsp;&nbsp;&nbsp;┗━━{$vv.name}</option>
                        {if isset($vv.childs) && !empty($vv.childs)}
                        {foreach $vv.childs as $vvv}
                        <option value="{$vvv.id}" {if isset($row.category_id)&&$row.category_id==$vvv.id}selected{/if} >
                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;┗━━{$vvv.name}</option>
                        {/foreach}
                        {/if}
                        {/foreach}
                        {/if]
                        {/foreach}
                    </select>
                </div>
            </div>


            <div class="layui-form-item">
                <label for="" class="layui-form-label">课程标题</label>
                <div class="layui-input-block">
                    <input type="text" readonly id="title" value="{$row.title}" lay-verify="required" placeholder="请输入课程标题" class="layui-input" >
                </div>
            </div>
            <div class="layui-form-item">
                <label for="" class="layui-form-label">名额数</label>
                <div class="layui-input-block">
                    <input type="number" readonly value="{$row.total_number}" placeholder="请输入名额数" class="layui-input" >
                </div>
            </div>

            <div class="layui-form-item">
                <label for="" class="layui-form-label">单价</label>
                <div class="layui-input-block">
                    <input type="text" readonly value="{$row.price}" placeholder="请输入单价" class="layui-input" >
                </div>
            </div>


            <!-- 不同课程展示不同 -->

            <div class="layui-upload">
                <label class="layui-form-label">课程轮播图</label>

                <blockquote class="layui-elem-quote layui-quote-nm " style="margin-top: 10px;margin-left: 110px;">

                    <div class="layui-upload-list" id="demo2">

                        {if !empty($row.image)}
                        {foreach $row.image as $v}

                        <li class="item_img"><div class="operate"></div>
                            <img src="{$v}" class="layui-upload-img" width="60">

                        </li>
                        {/foreach}
                        {/if}

                    </div>
                </blockquote>
            </div>

            <div class="layui-form-item">
                <label for="" class="layui-form-label">主图</label>
                <div class="layui-input-block">
                    <div class="layui-upload">
                        <div class="layui-upload-list" >
                            <ul class="layui-upload-box layui-clear">
                                {if isset($row.thumb)}
                                <li><img style="width:100px;height:60px" src="{$row.thumb}" /></li>
                                {/if}
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <label for="" class="layui-form-label">视频</label>
                <div class="layui-input-block">
                    <div class="layui-upload">
                        <button type="button" class="layui-btn layui-btn-sm uploadVideo" disabled><i class="layui-icon">&#xe67c;</i>视频上传</button>
                        <div class="layui-upload-list" style="margin-top: 10px;margin-left: 60px;" >
                            <ul class="layui-upload-box layui-clear">
                                {if isset($row.video)}
                                <li style="margin-left: -60px">
                                    <video  id='video' src="{$row.video}" width="400" height="200" controls autobuffer></video>
                                </li>
                                {/if}
                            </ul>

                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label for="" class="layui-form-label">课程信息</label>
                    <div class="layui-input-block">
                        <script id="container" readonly type="text/plain" style="width: 98%">
                            {$row.content|raw}
                        </script>
                    </div>
                </div>
                <input type="hidden" name="id" value="{$row.id}">
                <div class="layui-form-item">
                    <label for="" class="layui-form-label">备注</label>
                    <div class="layui-input-block">
                        <textarea  placeholder="请输入备注" name="remarks" class="layui-textarea">{$row.remarks}</textarea>
                    </div>
                </div>
            </div>

        </form>
    </div>
</div>
{include file='public/footer' /}
<script type="text/javascript">
    layui.use(['upload','layer','element','form'],function () {
        var $ = layui.jquery;
        var upload = layui.upload;

        var layer = layui.layer;
        var form = layui.form;
        //普通图片上传
        $(".uploadPic").each(function (index,elem) {
            upload.render({
                elem: $(elem)
                ,url: '{:__url("admin/upload/upload")}'
                ,multiple: false
                ,data:{"_token":"{{ csrf_token() }}"}
                ,done: function(res){
                    //如果上传失败
                    if(res.code == 0){
                        layer.msg(res.msg,{icon:1},function () {
                            $(elem).parent('.layui-upload').find('.layui-upload-box').html('<li><img src="'+res.url+'" /><p>上传成功</p></li>');
                            $(elem).parent('.layui-upload').find('.layui-upload-input').val(res.url);
                        })
                    }else {
                        layer.msg(res.msg,{icon:2})
                    }
                }
            });
        })

        //多图片上传
        upload.render({
            elem: '#test2',
            url: '{:__url("admin/upload/upload")}'
            //上传接口
            ,
            data:{"_token":"{{ csrf_token() }}"},
            multiple: false,

            before:function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
//                    $('#demo2').append()
                });
            },
            done: function (res) {
                //上传完毕
                if (res.code == 0) {
                    //console.log(111)
                    $('#demo2').append('<li class="item_img"><div class="operate"></i><i  class="close layui-icon"></i></div><img src="' + res.url + '" class="layui-upload-img" width="60"><input type="hidden" name="image[]" value="' + res.url + '"></li>');
                } else {
                    layer.msg(res.msg,{icon:2})
                }
            }
        });
//点击多图上传的X,删除当前的图片
        $("body").on("click",".close",function(){
            $(this).closest("li").remove();
        });
        $(".uploadVideo").each(function (index,elem) {
            upload.render({
                elem: $(elem)
                ,url: '{:__url("admin/upload/upload")}'
                ,multiple: false
                ,accept: 'video' //视频
                ,data:{"_token":"{{ csrf_token() }}"}
                ,done: function(res){
                    //如果上传失败
                    if(res.code == 0){
                        layer.msg(res.msg,{icon:1},function () {

                            $(elem).parent('.qa-xx-item').find('.layui-upload-input').val(res.url);
                        })
                    }else {
                        layer.msg(res.msg,{icon:2})
                    }
                }
            });
        })

        /*       // 试题类型切换事件
         form.on('radio(raQT)', function (data) {

         changeQT(data.value);
         });

         function changeQT(value, sel) {

         if (value == 2) {

         $('#xxGroup').show()
         } else{
         $('#xxGroup').hide()
         }
         }
         //默认加载课程分类
         $(function(){


         if($(':radio[name="type"]:checked').val() ==2){
         $('#xxGroup').show()
         } else{
         $('#xxGroup').hide()
         }


         })*/



        /*添加一行*/
        /* $('.add').click(function(){
         var html='<div class="qa-xx-item ">'+
         '<div class="layui-inline">'+
         '<input type="text" name="work[]" placeholder="请输入课时标题" class="layui-input layui-inline work" autocomplete="off" lay-verType="tips" lay-verify="required" required/>'+

         '</div>'+
         '<div class="layui-inline">'+
         '<input type="number" name="sort[]" value="0" lay-verify="required|number" placeholder="请输入排序" class="layui-input layui-inline work1" >'+
         '</div>'+
         '<button type="button" class="layui-btn uploadVideo"><i class="layui-icon"></i>上传视频</button>'+

         '<div class="layui-inline">'+
         '<input type="text" name="video[]" class="layui-input layui-upload-input layui-inline work1" >'+
         '</div>'+
         '<button  type="button" class="layui-btn icon-btn add"><i class="layui-icon">&#xe654;</i>新增</button>'+
         '<button  type="button" class="layui-btn icon-btn delone" ><i class="layui-icon"></i>删除</button>'+
         '</div>';
         $('.kecheng').append(html);
         })
         //删除一行数据
         $("body").on("click",".delone",function(){

         　　     $(this).parent().remove()

         })*/
        /*上传视频*/
        /* $("body").on("click",".uploadVideo",function(){

         upload.render({
         elem: $(this)
         ,url: '{{ route("api.upload") }}'
         ,multiple: false
         ,accept: 'video' //视频
         ,data:{"_token":"{{ csrf_token() }}"}
         ,done: function(res){
         //如果上传失败
         if(res.code == 0){
         layer.msg(res.msg,{icon:1},function () {

         $(elem).parent('.qa-xx-item').find('.layui-upload-input').val(res.url);
         })
         }else {
         layer.msg(res.msg,{icon:2})
         }
         }
         });


         });*/

    })
</script>
<link href="/baidu-editor/themes/default/css/umeditor.min.css" type="text/css" rel="stylesheet">
<script src="/baidu-editor/third-party/jquery.min.js"></script>
<!-- 配置文件 -->
<script type="text/javascript" src="/baidu-editor/umeditor.config.js"></script>
<!-- 编辑器源码文件 -->
<script type="text/javascript" src="/baidu-editor/umeditor.min.js"></script>
<!-- 实例化编辑器 -->
<script type="text/javascript">
    var ue = UM.getEditor('container');
</script>